import { Column } from '@ant-design/plots';
import React from 'react';
import ReactDOM from 'react-dom';
import { Select, Space } from 'antd';
import { mock } from './mock'

const DemoColumn = () => {
  const config = {
    data: mock,
    xField: 'name',
    yField: '活跃用户度',
    colorField: 'code',
    group: true,
    style: {
      // 矩形四个方向的内边距
      inset: 5,
      // 矩形单个方向的内边距
      // insetLeft:5,
      // insetRight:20,
      // insetBottom:10
      // insetTop:10
    },
  };
  return <>
  <Select
      defaultValue="lucy"
      style={{ width: 120 }}
      onChange={() => {}}
      options={[
        { value: 'jack', label: '线上活跃度' },
        { value: 'lucy', label: '成绩特征' },
        { value: 'Yiminghe', label: '课程参与' },
      ]}
    />
    <Column {...config} />
  </>;
};
export default DemoColumn;